<template>
  <el-card>
    <el-carousel height="400px" >
      <el-carousel-item v-for="item in carousel" :key="item">
        <img class="index-carousel-banner" :src="item.url">
      </el-carousel-item>
    </el-carousel>
  </el-card>
</template>

<script>
export default {
  // eslint-disable-next-line vue/multi-word-component-names
  name: 'Carousel',
  data () {
    return {
      carousel: [
        { url: require('@/assets/img/index/carousel/1.png') },
        { url: require('@/assets/img/index/carousel/2.png') },
        { url: require('@/assets/img/index/carousel/3.png') },
        { url: require('@/assets/img/index/carousel/4.png') }
      ]
    }
  }
}
</script>

<style scoped lang="less">
@import "carousel.less";
</style>
